<template>
  <div class="app-container">
    <ContractCurrentDateEdit ref="openContractCurrentDateEdit" @contractCurrentDateEdited="contractCurrentDateEdited"></ContractCurrentDateEdit>
    <ConstractProgramAdd ref="openConstractProgramAdd" @refresh="refresh"></ConstractProgramAdd>
    <ConstractProgramEdit ref="openConstractProgramEdit" @refresh="refresh"></ConstractProgramEdit>
    <!-- 合同详情 -->
    <div class="detail-title-box">
      <span>详情信息</span>
    </div>
    <el-form ref="queryParams" :model="queryParams" size="small" :inline="true" label-width="120px" :label-position="labelPosition">
        <!-- <el-form-item label="仓库" prop="spckmc">
            <el-select
            v-model="queryParams.spckmc"
            placeholder="请选择仓库"
            clearable
            @change="changeWarehouse"
            filterable 
            :loading="selectWarehouse20Loading"
            >
            <el-option
                v-for="item in warehouseList"
                :key="item.spckid"
                :label="item.spckmc"
                :value="item.spckid"
            />
        </el-select>
    </el-form-item> -->
    <!-- <el-form-item label="当前版次" prop="cx">
        <el-select
            v-model="queryParams.cx"
            placeholder="请选择当前版次"
            clearable
            @change="changeVersion"
        >
            <el-option
                v-for="item in contractCurrentVersion"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            />
        </el-select>
    </el-form-item> -->
    <!-- <el-form-item label="当前版次日期段" prop="versionDate">
        <el-date-picker
            v-model="versionDate"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :disabled="true">
            </el-date-picker>
      </el-form-item> -->
      <!-- <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item> -->
    </el-form>
    <div class="mt20 mb20 ml10">
      <el-descriptions>
        <el-descriptions-item label="当前版次日期段">{{ versionDate[0] + "至" + versionDate[1] }}</el-descriptions-item>
        <el-descriptions-item label="客户">{{ queryParams.khmc }}</el-descriptions-item>
      </el-descriptions>
    </div>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain size="mini" @click="handleAddContractProgram" v-hasPermi="['zhcloud:sfbz:add']">增加合同项目</el-button>
      </el-col>
    </el-row>
    <el-table
    v-loading="loading"
    :data="contractDetail"
    >
        <af-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="left" width="120">
            <template slot-scope="scope">
                <el-button
                    size="mini"
                    type="text"
                    @click="handleRowEdit(scope.row)"
                    v-hasPermi="['zhcloud:sfbz:modify']"
                >修 改</el-button>
                <el-button
                    size="mini"
                    type="text"
                    @click="handleRowDelete(scope.row)"
                    v-hasPermi="['zhcloud:sfbz:del']"
                >删 除</el-button>
            </template>
        </af-table-column>
        <af-table-column label="仓库列表" prop="spckmclist2" fixed="left" width="180" :show-overflow-tooltip="true"/>
        <af-table-column label="入仓装卸费(吨/元)" prop="csdj03"/>
        <af-table-column label="入仓不足吨数" prop="csdj02t"/>
        <af-table-column label="出仓装卸费(吨/元)" prop="csdj02"/>
        <af-table-column label="出仓不足吨数" prop="csdj03t"/>
        <af-table-column label="仓储费(吨/天/元)" prop="csdj01"/>
        <af-table-column label="备注" prop="csbz" width="150" :show-overflow-tooltip="true"/>
        <af-table-column label="货权转移费(元/吨)" prop="csdj04"/>
        <af-table-column label="合同编号" prop="csbh"/>
        <af-table-column label="版次" prop="cx"/>
        <af-table-column label="开始日期" prop="sdate"/>
        <af-table-column label="结束日期" prop="edate"/>
    </el-table>
     <el-row type="flex" justify="center" :gutter="5" class="mt20">
      <el-col :span="1.5">
        <el-button type="primary" @click="editCurrentDate" v-hasPermi="['zhcloud:sfbz:modify']">修改当前时间段</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button @click="goBack">返回</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getContractDetailList, contractDetailDel, getContractCurrentVersion } from "@/api/storage/contractFeeStandard"
import { selectWarehouse20 } from "@/api/storage/warehouse"
import ContractCurrentDateEdit from "./contractCurrentDateEdit.vue"
import ConstractProgramAdd from "./constractProgramAdd.vue"
import ConstractProgramEdit from "./constractProgramEdit.vue"

export default {
  name: "ContractDetailList",
  components: { ContractCurrentDateEdit, ConstractProgramAdd, ConstractProgramEdit },
  data() {
    return {
      // 显示搜索条件
      showSearch: true,
      //对齐方式
      labelPosition:"right",
      //详情加载
      loading:true,
      //当前版次时间段
      versionDate:"",
       //仓库加载
       selectWarehouse20Loading: true,
      //当前版次加载
      getContractCurrentVersionLoading: true,
      //删除详情参数
      delQureyParams: {
        csbh: "",
        csbz: "",
        csdj01: "",
        csdj02: "",
        csdj02t: "",
        csdj03: "",
        csdj03t: "",
        csdj04: "",
        csuid: "",
        cx: "",
        edate: "",
        khmcid: "",
        sdate: "",
        spa: "",
        spc: ""
      },
      currentVersionQuery: {
        csuid:""
      },
      //添加详情
      queryParams:{
        spckmc:"",
        khmcid:"",
        csuid:"",
        cx:"1"
      },
      //仓库列表
      warehouseList:[],
      //详情列表
      contractDetail:[],
      //当前版次
      contractCurrentVersion:[],
       //页数
      pageSize: 999,
      //页码
      pageNum:1,
      // 总条数
      total: 0,
    };
  },
beforeRouteEnter(to, from, next) {
    const query = to.query
    next(vm => {   
      if(Object.keys(query).length > 0) {
        vm.queryParams.khmcid = query.khid
        vm.queryParams.csuid = query.uid
        vm.queryParams.khmc = query.khmc
        vm.delQureyParams = {
          ...vm.delQureyParams,
          khmcid:query.khid,
          csuid:query.uid
        }
        vm.currentVersionQuery.csuid = query.uid
        vm.versionDate = [query.sdate, query.edate]
        vm.getWarehouse()
        vm.getCurrentVersion()
        vm.getList()
      }
    })
  },
  methods: {
      /**获取仓库 */
    getWarehouse() {
      this.selectWarehouse20Loading = true
      selectWarehouse20({}).then(response => {
        this.warehouseList = response.data
        this.selectWarehouse20Loading = false
      });
    }, 
    /**获取当前版次 */
    getCurrentVersion() {
      this.getContractCurrentVersionLoading = true
      getContractCurrentVersion(this.currentVersionQuery).then(response => {
        const data = response.data
        const versionStatus = []
        for(let i in data) {
          versionStatus[i] = {value:data[i].cx,label:data[i].cx}
        }
        this.contractCurrentVersion = versionStatus
        this.getContractCurrentVersionLoading = false
      });
    }, 
     /** 查询费用总览 */
    getList() {
      this.loading = true
      getContractDetailList(this.queryParams, {pageNum:this.pageNum, pageSize:this.pageSize}).then(response => {
        this.contractDetail = response.data
        this.loading = false
      });
    },  
      /**删除详情 */
    deleteContractDetail() {
      this.$modal.loading("数据正在删除中，请稍等...")
      contractDetailDel(this.delQureyParams).then(response => {
        this.$modal.closeLoading()
        this.$modal.msgSuccess('删除成功！')
        this.getList()
      }).catch(()=> {
        this.$modal.closeLoading()
      })
    }, 
    /** 行删除*/
    handleRowDelete(data) {
       this.$modal.confirm("是否删除记录？").then(() => {
        const delQureyParams = this.delQureyParams
        for(let i in delQureyParams) {
          if(data[i]) delQureyParams[i] = data[i]    
        }
        this.delQureyParams = {
          ...this.delQureyParams,
          spa:data.csidlist2,
          spc:data.spckidlist2
        }
        this.deleteContractDetail()
      }).catch(() => {})
    },
    /**行修改 */
    handleRowEdit(row) {
        const data = JSON.parse(JSON.stringify(row))
        const query = this.$route.query
        this.$refs.openConstractProgramEdit.open(data, query)
    },
    /**修改当前时间段 */
    editCurrentDate() {
      const data = this.$route.query
      this.$refs.openContractCurrentDateEdit.open(data)
    },
    /**选择仓库 */
    changeWarehouse() {
        this.getList()
    },
    /**选择当前版次 */
    changeVersion() {
        this.getList()
    },
    /**添加合同项目 */
    handleAddContractProgram() {
      const data = this.$route.query
      this.$refs.openConstractProgramAdd.open(data)
    },
    //刷新
    refresh( ){
      this.getList()
    },
      /** 重置按钮操作 */
    resetQuery() {
      this.reset()
      this.getList()
    },
    /**重置 */
    reset(vm) {
      Object.assign(vm.$data, vm.$options.data())
    },
     /**返回不刷新 */
    goBack() {
      const query = this.$route.query
      const data = {khmc:query.khmc,khid:query.khid}
      this.$router.push({path:"/storage/contractFeeStandard/contractDetail", query:data})
    },
  }
};
</script>
